<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天气预报</title>
</head>
<body>
    <table id="tq">
        <caption>未来七天天气预报</caption>
        <thead>
            <tr>
                <th>日期</th>
                <th>天气预报</th>
                <th>温度</th>
                <th>风力</th>
                <th>空气等级</th>
                <th>建议</th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</body>
<script src="./jquery.js"></script>
<script>
    function request(option){
         var def = $.Deferred();
         if(!option || !option.url){
            throw Error('url is undefined');
         }
         var _confing ={
            url: option.url,
            type:'get',
            dataType:'JSON',
            success:function(res){
                def.resolve(res);
            },
            error:function(a,b,err){
                def.reject(err);
            }
         }
         //$.extend(_config,option,true);
         $.ajax(_confing);
         return def.promise();
    }

    var option = {
        url: 'http://v1.yiketianqi.com/api?unescape=1&version=v9&appid=13955891&appsecret=K1xspFHc'
    };

    request(option).then(function(data){
        console.log(data);
        for (var d of data.data){
            var tr = document.createElement('tr');
            var td1 = document.createElement('td');   $(td1).html(d.date);
            var td2 = document.createElement('td');   $(td2).html(d.wea);
            var td3 = document.createElement('td');   $(td3).html('最高温度：' + d.tem1 +"℃，最低温度:" + d.tem2 + "℃"); $(tr).append(td3);
            var td4 = document.createElement('td');   $(td4).html(d.win_speed);  $(tr).append(td4);
            var td5 = document.createElement('td');   $(td5).html(d.air_level);  $(tr).append(td5);
            var td6 = document.createElement('td');   $(td6).html(d.air_tips);   $(tr).append(td6);
            
            $('#tq').append(tr);
        }
    },function(err){
        console.log(err);
    })

</script>
</html>